<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>EQEmu</title>
    <link rel="stylesheet" type="text/css" href="style/style.css"/>
    <script src="scripts/jquery.js"></script>
    <script>
    <!--
    var hidden_text = true;
    var timeout = null;

    var idx = Math.floor((Math.random()*100000000));
    function GetStatusIdx() {
        return idx++;
    }

    function StatusTic() {
        $.getJSON("data/console_data.html?idx="+GetStatusIdx(),
        function(data) {
            var elm = document.getElementById("console_output");
            var message = "";
            var cout = $('#console_output');

            for(var i = 0; i < data.message_count; i++) {
                message += data.messages[i].message;
                message += "\n";
            }

            var cur_value = elm.value;
            if(cur_value != message) {
                elm.value = message;
                cout.scrollTop(99999);
            }
        });
    }

    function ConsoleKey(event) {
        if(hidden_text == true) {
            return;
        }

        var keycode = ('which' in event) ? event.which : event.keyCode;
        if(keycode == 13) {
            var cinp = document.getElementById("console_input");
            var cinp_value = cinp.value;
            cinp_value = cinp_value.replace(/"/g, "\\\"");
            cinp.disabled = true;
            HideError();
            timeout = setTimeout("CommandTimeout()", 10000);

            $.getJSON("actions/console_action.html?action=input&text="+cinp_value+"&idx="+GetStatusIdx(),
            function(data) {
                cinp.value = "";
                cinp.disabled = false;
                clearInterval(timeout);
                if(data.status == 0) {
                    ShowError(data.message);
                }
                StatusTic();
            });
        }
    }

    function BodyKey(event) {
        var keycode = ('which' in event) ? event.which : event.keyCode;
         if (keycode == 27 && hidden_text == false) {
            HideInput();
        } else if(hidden_text == false) {
            return;
        }

        if(keycode == 13) {
            ShowInput();
        }
    }

    function ShowInput() {
        hidden_text = false;
        document.getElementById("console_input").value="";
        $("#console_input").fadeIn("slow");
        document.getElementById('console_input').focus();
    }

    function HideInput() {
        hidden_text = true;
        document.getElementById("console_input").value="";
        $("#console_input").fadeOut("slow");
        HideError();
    }

    function ShowError(msg) {
        $("#console_error").html("Error: " + msg);
        $("#console_error").show();
        $("#console_error").css("display", "block");
    }

    function HideError() {
        $("#console_error").html("");
        $("#console_error").hide();
    }

    function CommandTimeout() {
        var cinp = document.getElementById("console_input");
        cinp.disabled = false;
        alert("Timed out sending command to server.");
    }

    $(document).ready(function() {
        StatusTic();
        setInterval("StatusTic()", 5000);
        var elm = document.getElementById("console_output");
        elm.value = "";

        elm = document.getElementById("console_input");
        elm.value = "";
        elm.disabled = false;

        $('#console_output').scrollTop(99999);
    });
    -->
    </script>
</head>
<body onkeyup="BodyKey(event)">
    <div class="container">
        <?do("templates/scripts/menu.pl");?>
        <div id="main_content" class="main">
            <div align="center">
                <textarea id="console_output" class="console_out" cols="110" rows="40" readonly style="resize:none;"></textarea>
                <span id="console_error" class="error" style="display: none;"></span>
                <input id="console_input" class="console_in" type="text" style="display: none; width: 67.6em;" onkeyup="ConsoleKey(event)">
            </div>
        </div>
    </div>
    <div class="footer">
        &copy 2012 EQEmu. All rights reserved.
    </div>
</body>
</html>
